import Vue from 'vue'
import App from './App.vue'
// 1. 下载vue-router
// 2. 引入vue-router
import VueRouter from "vue-router"
// 3. 使用路由插件
Vue.use(VueRouter)
// 4. 创建路由规则  引入组件
//   - 一级路由组件
import Home from "./components/Home.vue"
import Journalism from "./components/Journalism.vue"
import Sports from "./components/Sports.vue"
//   -  二级路由组件
import HomePage from "./components/views/HomePage.vue"
import DomesticSports from "./components/views/DomesticSports.vue"
import ForeignSports from "./components/views/ForeignSports.vue"
const routes = [
  {
    path: '/',
    redirect: Home, // 重定向
  },
  {
    path: '/home',
    component: Home,
  },
  {
    path: '/journalism',
    component: Journalism,
  },
  {
    path: '/sports',
    component: Sports,
    children: [
      {
        path: 'homepage',
        component: HomePage,
      },
      {
        path: 'domesticsports',
        component: DomesticSports,
      },
      {
        path: 'foreignsports',
        component: ForeignSports,
      }

    ]

  },
]
// 5. 创建路由对象 插入规则
const router = new VueRouter({ routes: routes })
Vue.config.productionTip = false
// 关联Vue实例
new Vue({
  router: router,
  render: h => h(App),
}).$mount('#app')
